<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>el和data</title>
		<script type="text/javascript" src="js/vue.js"></script>
	</head>
	<body>
	</body>
	<!-- 准备好一个容器-->
	<div id="root">
		你好，{{name}}
	</div>

	<script type="text/javascript">
		Vue.config.productionTip=false;
		//创建实例
		const x = new Vue({
			// el:'#root',//选择容器
			data:{
				name:'一个Vue'
			}
		});
		// 等同于上面
		x.$mount('#root');
		// 一个实例只能接管一个容器，所以下面的root无法渲染
		
		
		//函数定义数据
		new Vue({
			el:'#root1',
			// 函数式
			data:function(){
				return {
					name:'123'
				}
			}
		})
		
		new Vue({
			el:'#root2',
			// 函数式
			data(){
				return {
					name:'123'
				}
			}
		})
	</script>
</html>
